导航菜单
首页 >  formData上传多文件错误请求显示object  > 【Vue】vue+axios+FormData上传多个文件

【Vue】vue+axios+FormData上传多个文件

html

一般网页上传文件大家都会用到这个标签

我们可以通过这个标签选取文件,使用js进行文件上传等操作,同时,该标签同时可以选取多个文件:

但有些时候,进行其他操作的时候,用户需要获得文件夹路径,那么这种写法可以用该标签选取文件夹

使用ant-design的upload组件时获得文件夹路径的方式:

Upload Directory

 注意input file 是不支持v-model的,因为v-model是双向数据绑定,而input file里面的文件只能通过点击选取来进行变更。

jsv_upload_files(e) { let files = e.target.files let formData = new FormData() // formData重复的往一个值添加数据并不会被覆盖掉,可以全部接收到,可以通过formData.getAll('files')来查看所有插入的数据 for (let i = 0;i < files.length;i++) {formData.append('files', files[i]) } let url = '/files/uploadfiles' let headers = {'Content-Type': 'multipart/form-data' } axios.post(url, formData, {headers: headers})}

需要注意的是请求头需要设置为'Content-Type': 'multipart/form-data'

参照:https://juejin.cn/post/6844903934469865485

参照:https://blog.csdn.net/shi_6_tians/article/details/103750752

相关推荐: